import { setBackgroundColorAsync } from 'expo-navigation-bar';
import ZoomViewer from './viewer';
import { openDialog } from '../Dialog';

type Options = {
  urls: string[];
  index: number;
}

export const openZoomViewer = (options: Options) => {
  return new Promise((resolve) => {
    setBackgroundColorAsync('#000');
    const closeDialog = openDialog({
      type: 'center',
      onClose: () => {
        resolve(undefined);
        setBackgroundColorAsync('#fff');
      },
      content({ height }) {
        return (
          <ZoomViewer
            {...options}
            height={height}
            onClose={closeDialog}
          />
        )
      },
    })
  });
}

export default openZoomViewer;